<template>
	<view class="container">
		<view class="no-data" v-if="list.length == 0">
			暂无收货地址，请添加
		</view>
		<radio-group @change="radioChange">
			<label class="uni-list-cell uni-list-cell-pd" v-for="(item,index) in list" :key="item.id">
				<view class="item">
					<view class="info">
						<view class="">
							<text class="name">{{item.name}}</text>
							<text class="tel">{{item.mobile}}</text>
						</view>
						<view class="address">
							{{item.address}}
						</view>
					</view>
					<view class="bar row">
						<view row>
							<radio :value="item.id" :checked="item.isDefault === 1" color="#DB3012" /><text>默认地址</text>
						</view>
						<view class="operate row">
							<view class="edit row" @click.stop="edit(item.id)">
								<image src="../../static/img/bj.png" mode=""></image>
								<text>编辑</text>
							</view>
							<view class="delete row" @click.stop="del(item.id)">
								<image src="../../static/img/sc.png" mode=""></image>
								<text>删除</text>
							</view>
						</view>
					</view>
				</view>
			</label>
		</radio-group>
		<view class="footer center">
			<view class="btn" @click="addAddress()">
				添加地址
			</view>
		</view>
	</view>
</template>

<script>
	import comm from '../../static/data/commFunc.js'
	import cfg from '../../static/data/config.js'
	var r = cfg.router;
	export default {
		data() {
			return {
				list: [],
				current: 0
			};
		},
		onLoad(e) {
		},
		onShow() {
			this.getAddress()
		},
		methods: {
			getAddress() {
				let data = {}
				comm.request("POST", "/app/memberAddress/list", data, (res, data) => {
					console.log("我的地址", res)
					if (res.data.ret_code == 200) {
						this.list = data
					} else {
						comm.showToast(res.data.ret_msg, "none")
					}
				})
			},
			radioChange: function(evt) {
				console.log(evt)
				let data = {
					id: evt.detail.value
				}
				comm.request("POST", "/app/memberAddress/getDefaultAddr", data, (res, data) => {
					console.log("我的地址", res)
					if (res.data.ret_code == 200) {
						comm.showToast("设置成功")
						uni.navigateBack({
						    delta: 1
						});
					} else {
						comm.showToast(res.data.ret_msg, "none")
					}
				})
			},
			addAddress() {
				comm.navigateTo(r.addAddress)
			},
			edit(e){
				comm.navigateTo(r.addAddress +"?id=" +e)
			},
			del(e){
				var that = this;
				let id = e
				uni.showModal({
				    title: '提示',
				    content: '确定删除该地址吗',
				    success: function (res) {
				        if (res.confirm) {
				            console.log('用户点击确定');
										console.log(id,"id==========")
										let data = {id:id}
										comm.request("POST", "/app/memberAddress/delMemberAddr", data, (res, data) => {
											console.log("删除地址", res)
											if (res.data.ret_code == 200) {
												comm.showToast("删除成功")
												that.getAddress()
											} else {
												comm.showToast(res.data.ret_msg, "none")
											}
										})
				        } else if (res.cancel) {
				            console.log('用户点击取消');
										comm.showToast("取消删除","none")
				        }
				    }
				});
			}
		}
	}
</script>

<style lang="less">
	page {
		background: #F9F9F8;
	}

	.container {
		padding-bottom: 120rpx;
	}

	.item {
		background: rgba(255, 255, 255, 1);
		border-radius: 20rpx;
		padding: 30rpx;
		margin: 30rpx;

		.info {
			flex: 1;

			.name {
				font-size: 30rpx;
				font-weight: bold;
				color: rgba(25, 17, 11, 1);
				margin-right: 30rpx;
			}

			.tel,
			.address {
				font-size: 24rpx;
				color: rgba(153, 153, 153, 1);
				word-break: break-word;
			}

			.address {
				margin-top: 10rpx;
			}
		}

		.bar {
			margin-top: 30rpx;
			padding-top: 30rpx;
			border-top: 1rpx solid #F2F2F2;
			justify-content: space-between;
			font-size: 26rpx;
			color: rgba(25, 17, 11, 1);

			.operate {

				.edit {
					margin-left: 30rpx;

					image {
						width: 30rpx;
						height: 29rpx;
						margin-right: 20rpx;
					}
				}

				.delete {
					margin-left: 30rpx;

					image {
						width: 29rpx;
						height: 32rpx;
						margin-right: 20rpx;
					}
				}
			}
		}
	}

	.footer {
		width: 100%;
		box-shadow: 0rpx 6rpx 10rpx 0rpx rgba(0, 0, 0, 0.04);
		padding: 22rpx 0;
		position: fixed;
		background: #FFFFFF;
		bottom: 0;
		z-index: 99;

		.btn {
			width: 345rpx;
			height: 79rpx;
			line-height: 79rpx;
			text-align: center;
			background: rgba(217, 48, 17, 1);
			border-radius: 40rpx;
			font-size: 28rpx;
			color: #FFFFFF;
		}
	}
</style>
